@charset "utf-8";
.web{
    width: 100%;
    height: 100%;
    background: url(../img/index/bj.png) no-repeat left top/cover;
    position: relative;
    overflow: hidden;
    >div{
        position: absolute;
    }
    .logo{
        left: 19px;
        top: 24px;
    }
    .xx1{
        left: 54px;
        top: 164px;
    }
    .xx2{
        left: 122px;
        top: 308px;
    }
    .xx3{
        left: 30px;
        top: 489px;
    }
    .xx4{
        right: 43px;
        top: 269px;
    }
    .shu{
        left: 50%;
        bottom: 270px;
        >img{
            margin-left: -50%;
        }
        
    }
    .xxda{
        left: 50%;
         >img{
            margin-left: -50%;
        }
        bottom: 838px;
    }
    .cao{
        bottom: 116px;
        left: 50%;
         >img{
            margin-left: -50%;
        }
    }
    .cao2{
        bottom: 135px;
        left: 50%;
         >img{
            margin-left: -50%;
        }
    }
    .text1{
       left: 50%;
         >img{
            margin-left: -50%;
        } 
        bottom:270px;
    }
    .text2{
        left: 50%;
         >img{
            margin-left: -50%;
        }
       bottom:170px;
        
    }
    .zj{
        left: 50%;
         >img{
            margin-left: -50%;
        }
       bottom:137px;
    }
    .yuan{
        box-sizing: border-box;
        width: 313px;
        height: 116px;
        left: 50%;
        font-size: 35px;
//      line-height: 116px;
        text-align: center;
        color: #fff;
        transform: translateX(-50%);
        background: url(../img/index/yuan.png) no-repeat left top;
       bottom:0;
       >div{
           
           width: 50px;
           height: 30px;
           background: url(../img/index/daosanj.png) no-repeat left top/contain;
           margin: 10px auto;
       }
    }
    .ge9{
        transition: all .5s linear;
        top: 100%;
        width: 100%;
        height: 100%;
        overflow: hidden;
        .g_hd{
            width: 100%;
            height: 20%;
            position: relative;
            background: url(../img/9gong/fotbj.png) no-repeat left top/cover;
            .g_txt{
                margin: 0 auto;
                width: 525px;
                height: 100%;
                background: url(../img/9gong/bitaotibj.png) no-repeat left bottom;
                position: relative;
                >div{
                    position: absolute;
                }
                .g_t1{
                   bottom: 77px;
                    left: 50%;
                    transform: translateX(-50%);
                }
                .g_t2{
                   bottom: 19px;
                   left: 50%;
                    transform: translateX(-50%);
                }
            }
            .g_gz{
                position: absolute;
                top: 20px;
                left: 15px;
            }
            .g_ms{
                position: absolute;
                top: 20px;
                right: 15px;
                
            }
        }
        .g_bd{
            width: 100%;
            height: 80%;
            background: #c8c8c8;
            position: relative;
            
            .gz{
                transition: all 1s ease-in-out;
                width: 1%;
                height: 95%;
                z-index: 15;
                position: absolute;
                transform: translateX(-50%);
                top: -200%;
                left:50%;
                
                >img{
                    width: 100%;
                    height: 100%;
                }
                .off{
                    position: absolute;
                    top: 0;
                    right: 0;
                    
                    transform: translateY(-50%);
                    >img{
                        width: 0;
                       transform: translateX(50%); 
                    }
                }
            }
            >li{
                
                width: 33.33%;
                height: 33.33%;
                box-sizing: border-box;
                position: relative;
                border: 1px solid red;
                float: left;
                >img{
                    width: 100%;
                    height: 100%;
                }
                
            }
            >li:nth-child(2n-1){
                background: #c4004f;
            }
            >li:nth-child(2n){
                background: #940e2b;
            }
            .zjym{
                    transition: all 1s;
                    position: absolute;
                    
                    left: 0;
                    top:0;
                    width: 100%;
                    height: 100%;
                    transform: scale(0);
                    background: url(../img/9gong/bejin_02.png) no-repeat left top/cover;
                    .zj_jp{
                        width: 100%;
                        height: 100%;
                        position: relative;
                        
                        .zj_t1{
                            top: 150px;
                            position: absolute;
                            left: 50%;
                            transform: translateX(-50%);
                        }
                        .jp{
                            bottom: 210px;
                            width: 40%;
                            height: 370px;
                            >img{
                                width: 100%;
                                height: 100%;
                            }
                            position: absolute;
                            left: 50%;
                            transform: translateX(-50%);
                        }
                        .zj_an{
                            bottom: 45px;
                            position: absolute;
                            left: 50%;
                            transform: translateX(-50%);
                        }
                        
                        
                        .zj_dh{
                            transition: all 1s;
                            width: 100%;
                            height: 100%;
                            transform: scale(0);
                            position: relative;
                            background: url(../img/9gong/bj22.png) no-repeat left top/cover;
                            .dh_zj{
                                left: 50%;
                                transform: translateX(-50%);
                                top: 50px;
                            }
                            .dh_next{
                                left: 50%;
                                transform: translateX(-50%);
                                bottom: 45px;
                            }
                            .dh_txt{
                                left: 50%;
                                transform: translateX(-50%);
                                width: 80%;
                                bottom: 255px;
                                >p{
                                    font-size: 30px;
                                }
                                >input{
                                    width: 98%;
                                    height: 40px;
                                    font-size: 30px;
                                    color: red;
                                    padding: 2px 0;
                                    text-align: center;
                                }
                                >span{
                                    
                                    display: block;
                                    margin: 40px 0;
                                    color: #e5004f;
                                    font-size: 35px;
                                }
                            }
                            >div{
                                position: absolute;
                                
                            }
                            .zj_dj{
                                width: 100%;
                                height: 100%;
                                left: 0;
                                top: 0;
                                transform: scale(0);
                                transition: all 1s;
                                .zj_dh2{
                                    
                                    width: 100%;
                                    height: 100%;
                                    
                                    position: relative;
                                    background: url(../img/9gong/bj22.png) no-repeat left top/cover;
                                    .dh2_zj{
                                        top: 50px;
                                    }
                                    .dh2_next{
                                        bottom: 45px;
                                    }
                                    .dh2_txt{
                                        
                                        width: 80%;
                                        bottom: 255px;
                                        >p{
                                            font-size: 30px;
                                        }
                                        
                                        >span{
                                            
                                            display: block;
                                            margin: 40px 0;
                                            color: #e5004f;
                                            font-size: 35px;
                                        }
                                        .ewm{
                                            width: 226px;
                                            height: 226px;
                                            margin: 0 auto;
                                            >img{
                                                width: 100%;
                                                height: 100%;
                                            }
                                        }
                                    }
                                    >div{
                                        position: absolute;
                                        left: 50%;
                                        transform: translateX(-50%);
                                    }
                                }
                            }
                        }
                    }
                    
            }
        }
    }
}
.bj{
    width: 100%;
    height: 100%;
    background: rgba(246,180,9,.5);
    position: absolute;
    top: 0;
}
